<template>
	<view class="content" v-if="show==1">
		<view class="main">
			<view class="info">
				<view class="info2"><text>*</text>师傅昵称</view>
				<view class="info3">
					<input type="text" placeholder-class="zhuzhu" @input="nickname" placeholder="请填写您的昵称,在前端展示" :value="teacher.nickname"/>
				</view>
			</view>
			<!--<view class="info">
				<view class="info2"><text>*</text>您的籍贯</view>
				<view class="info3">
					<picker mode ="multiSelector" @columnchange="sheng" @change="chengshi" :value="jcy" :range="city">
						<text v-if="teacher.sheng">{{diqu[jcy[0]].name}}-{{diqu[jcy[0]].city[jcy[1]]}}-{{diqu[jcy[0]].shi[jcy[1]].xian[jcy[2]]}}</text>
						<text v-if="!teacher.sheng" style="color:#8a8a8a;">请选择籍贯</text>
					</picker>
				</view>
				<image src="../../static/xiaxia.png" mode="aspectFill" class="xiaxia"></image>
			</view>-->
			<view class="info">
				<view class="info2"><text>*</text>手机号码</view>
				<view class="info3">
					<input type="text" style="color:#666;width:50%;float: left;" disabled="true" :value="teacher.mobile"/>
					<view class="genghuan" @click="gengh">更换</view>
				</view>
			</view>
			<view class="info">
				<view class="info2"><text>*</text>工作分类</view>
				<view class="info3">
					<picker mode ="multiSelector" @columnchange="catel" @change="xue" :value="cy" :range="xueke">
						<text>{{cate[cy[0]].title}}-{{cate[cy[0]].cate[cy[1]]}}</text>
					</picker>
				</view>
				<image src="../../static/xiaxia.png" mode="aspectFill" class="xiaxia"></image>
			</view>
			<view class="info">
				<view class="info2"><text>*</text>地址</view>
				<view class="info3">
					<input type="text" @click="addr" placeholder-class="zhuzhu" placeholder="请选择您附近的地址" disabled="true" :value="teacher.address"/>
				</view>
			</view>
			<!--<view class="info">
				<view class="info2"><text>*</text>工作经验</view>
				<view class="info3">
					<view class="jingyan" @click="jian">-</view>
					<view class="jingyan2">
						<input type="number" @input="gzyear" :value="teacher.px_year">
					</view>
					<view class="jingyan3" @click="jia">+</view>
					<view class="jingyan4">年</view>
				</view>
			</view>-->
			<view class="info">
				<view class="info2" style="height:80px;line-height: 80px;"><text>*</text>商家头像</view>
				<view class="info3" style="height:80px;line-height: 80px;">
					<image @click="aa" :src="!teacher.avatar?'../../static/cs.png':teacher.avatar" mode="aspectFill"/>
				</view>
			</view>
			<view class="info5">
				<view class="info6">自我介绍</view>
				<view class="info7">
					<textarea :value="teacher.intro" placeholder-class="zhuzhu" @input="jieshao" placeholder="请填写您对自己的介绍，会在主页展示" />
				</view>
			</view>
			<view class="info5">
				<view class="info6">店铺展示（会在主页展示）</view>
				<view class="info7" style="padding-top: 6px;">
					<view class="fengcai" v-for="(img,index) in teacher.images">
					<image class="fcimg" :src="img" mode="aspectFill"/>
					<image class="fccha" @click="delimg" :data-index="index" src="../../static/images/cha.png" mode="aspectFill"/>
					</view>
					<view class="fengcai" @click="fc">
					<image class="fcimg" src="../../static/cs.png" mode="aspectFill"/>
					</view>
				</view>
			</view>
			<view style="width:100%;height:50px;"></view>
			<view class="info4" @click="baocun2">
				保存
			</view>
		</view>
		<view v-if="is_gh==true" style="width:100%;">
		<view class="geng"></view>
		<view class="geng2">
			<view class="geng3">
				<text>更换手机号</text>
				<image @click="gengh" src="../../static/cha.png" mode="aspectFit"></image>
			</view>
			<view class="geng4">
				<view class="geng5">手机号码</view>
				<view class="geng6">
					<view class="geng7" @click="send">{{yzm}}</view>
					<input type="text" @input="mobile" placeholder-class="zhuzhu" placeholder="请输入新的手机号" />
				</view>
			</view>
			<view class="geng4">
				<view class="geng5">验证码</view>
				<view class="geng6">
					<input type="text" @input="yanzhengma" style="width:100%;" placeholder-class="zhuzhu" placeholder="请输入短信验证码" />
				</view>
			</view>
			<view class="geng8" @click="yanzheng">确定更改</view>
		</view>
		</view>
	</view>
</template>

<script>
	var app=getApp();
	var dingshi;
	export default {
		data() {
			return {
				show:0,
				uid:0,
				is_gh:false,
				sex:['男','女'],
				xueke:[],
				cate:[],
				cy:[],
				sc:0,
				city:[],
				jcy:[0,0,0],
				diqu:[],
				sindex:0,
				cindex:0,
				teacher:[],
				yzm:'获取验证码',
				newmobile:'',
				code:'',
				is_send:false,
				time:60
			}
		},
		onLoad() {
			const uid = uni.getStorageSync('uid');
			if(app.isBlank(uid)==true){
				app.error_msg("请先登录");
			}
			this.uid=uid;
			this.getdata();
		},
		methods: {
			getdata(){
				var that=this;
				uni.showLoading({
				    title: '数据加载中'
				});
				uni.request({
				    url: app.globalData.url+"laoshi/info",
					method:"POST",
					dataType:"json",
					header: {
					    'content-type': 'application/x-www-form-urlencoded'
					},
				    data: {uid:that.uid},
				    success: (res) => {
						uni.hideLoading();
						if(res.data.code!=1){
							app.error_msg(res.data.msg);
						}
						that.city=res.data.data.city
						that.diqu=res.data.data.diqu
						that.jcy=res.data.data.jindex
						that.teacher=res.data.data.teacher
						that.xueke=res.data.data.xueke
						that.cate=res.data.data.cate
						that.cy=res.data.data.index
						that.show=1;
				    }
				});
			},
			baocun2(){
				var that=this;
				if(app.isBlank(this.teacher.nickname)==true){
					uni.showToast({
					    title: "请填写师傅昵称",
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				/*if(app.isBlank(this.teacher.sheng)==true){
					uni.showToast({
					    title: "请选择您的籍贯",
						icon:'none',
					    duration: 1500
					});
					return false;
				}*/
				if(app.isBlank(this.teacher.address)==true){
					uni.showToast({
					    title: "请选择地址",
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				/*if(app.isBlank(this.teacher.px_year)==true){
					uni.showToast({
					    title: "请设置工作经验",
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				if(this.teacher.px_year<0){
					uni.showToast({
					    title: "工作经验不能小于0",
						icon:'none',
					    duration: 1500
					});
					return false;
				}*/
				if(app.isBlank(this.teacher.avatar)==true){
					uni.showToast({
					    title: "请上传商家头像",
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				
				uni.showLoading({
				    title: '提交中..'
				});
				that.baocun();
			},
			baocun(){
				var that=this;
				if(app.isBlank(this.teacher.images)==false){
					this.teacher.imgs=this.teacher.images.toString();
				}else{
					this.teacher.imgs='';
				}
				this.teacher.cid=this.cate[this.cy[0]].id;
				this.teacher.cid2=this.cate[this.cy[0]].cate2[this.cy[1]].id;
				
				var u=JSON.stringify(that.teacher);
				u=JSON.parse(u)
				u.uid=that.uid;
				uni.request({
				    url: app.globalData.url+"laoshi/doinfo",
					method:"POST",
					dataType:"json",
					header: {
					    'content-type': 'application/x-www-form-urlencoded'
					},
				    data: u,
				    success: (res) => {
						uni.hideLoading();
						if(res.data.code!=1){
							uni.showToast({
							    title: res.data.msg,
								icon:'none',
							    duration: 1500
							});
							return false;
						}
						uni.showToast({
						    title: res.data.msg,
							icon:'success',
						    duration: 1000
						});
						setTimeout(function(){
							uni.navigateBack({
							    delta: 1
							});
						},1000)
				    }
				});
			},
			jian(){
				if(this.teacher.px_year<=0){
					this.teacher.px_year=0;
				}else{
					this.teacher.px_year--;
				}
			},
			jia(){
				if(this.teacher.px_year<0){
					this.teacher.px_year=0;
				}else{
					this.teacher.px_year++;
				}
			},
			chengshi: function(e) {
				var index=e.detail.value;
				this.teacher.sheng=this.diqu[index[0]].name;
				this.teacher.shi=this.diqu[index[0]].city[index[1]];
				this.teacher.xian=this.diqu[index[0]].shi[index[1]].xian[index[2]];
				this.jcy=e.detail.value;
			},
			sheng: function(e) {
				if(e.detail.column==0){
					this.city[1]=this.diqu[e.detail.value].city;
					this.sindex=e.detail.value;
					var len=this.diqu[e.detail.value].city.length;
					len=parseInt(len);
					if(len<=this.cindex){
						this.city[2]=this.diqu[e.detail.value].shi[0].xian;
					}else{
						this.city[2]=this.diqu[e.detail.value].shi[this.cindex].xian;
					}
					this.$forceUpdate();
				}
				if(e.detail.column==1){
					this.city[2]=this.diqu[this.sindex].shi[e.detail.value].xian;
					this.cindex=e.detail.value;
					this.$forceUpdate();
				}
			},
			send(){
				if(this.is_send==true){
					return false;
				}
				var that=this;
				if(app.isBlank(this.newmobile)==true){
					uni.showToast({
					    title: '请输入手机号',
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				uni.showLoading({
				    title: '发送中'
				});
				uni.request({
				    url: app.globalData.url+"index/sms",
					method:"POST",
					dataType:"json",
					header: {
					    'content-type': 'application/x-www-form-urlencoded'
					},
				    data: {mobile:that.newmobile,type:4},
				    success: (res) => {
						uni.hideLoading();
						if(res.data.code!=1){
							uni.showToast({
							    title: res.data.msg,
								icon:'none',
							    duration: 1500
							});
							return false;
						}
						uni.showToast({
						    title: res.data.msg,
							icon:'success',
						    duration: 1000
						});
						this.is_send=true;
						dingshi=setInterval(function(){
							that.shijian();
						},1000);
				    }
				});
			},
			shijian(){
				this.yzm=this.time+"S";
				this.time=this.time-1;
				if(this.time<0){
					this.yzm="重新获取";
					this.time=60;
					this.is_send=false;
					clearInterval(dingshi);
				}
			},
			yanzheng(){
				var that=this;
				if(app.isBlank(this.newmobile)==true){
					uni.showToast({
					    title: '请输入手机号',
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				if(app.isBlank(this.code)==true){
					uni.showToast({
					    title: '请输入验证码',
						icon:'none',
					    duration: 1500
					});
					return false;
				}
				uni.showLoading({
				    title: '验证中..'
				});
				uni.request({
				    url: app.globalData.url+"user/ruzhum",
					method:"POST",
					dataType:"json",
					header: {
					    'content-type': 'application/x-www-form-urlencoded'
					},
				    data: {mobile:that.newmobile,code:that.code,uid:that.uid},
				    success: (res) => {
						uni.hideLoading();
						if(res.data.code!=1){
							uni.showToast({
							    title: res.data.msg,
								icon:'none',
							    duration: 1500
							});
							return false;
						}
						that.is_gh=false;
						that.teacher.mobile=that.newmobile;
						taht.is_send=true;
						that.yzm="获取验证码";
						that.time=60;
						clearInterval(dingshi);
				    }
				});
			},
			gengh(){
				this.is_gh=!this.is_gh;
			},
			aa(){
				var that=this;
				uni.showActionSheet({
				    itemList: ['使用相机', '访问相册'],
				    success: function (res) {
						that.img(res.tapIndex);
				    },
				    fail: function (res) {
				        console.log(res.errMsg);
				    }
				});
			},
			img(t){
				var that=this;
				if(t==0){
					var lx=["camera"];
				}else{
					var lx=["album"];
				}
				uni.chooseImage({
				    count: 1,
					sizeType:"compressed",
					sourceType:lx,
				    success: function (res) {
				        const tempFilePaths = res.tempFilePaths;
						uni.showLoading({
						    title: '上传中'
						});
						uni.uploadFile({
							url: app.globalData.url+'upload/uploadImg',
							filePath: tempFilePaths[0],
							name: 'file',
							success: (uploadFileRes) => {
								uni.hideLoading();
								var str=JSON.parse(uploadFileRes.data)
								if(str.code!=1){
									uni.showToast({
									    title: res.data.msg,
										icon:'none',
									    duration: 1500
									});
									return false;
								}
								uni.showToast({
								    title: str.msg,
									icon:'success',
								    duration: 1000
								});
								that.teacher.avatar=str.data.image;
							}
						});
				    },
					fail(e){
						console.log(e);
					}
				});
			},
			fc(){
				var that=this;
				uni.showActionSheet({
				    itemList: ['使用相机', '访问相册'],
				    success: function (res) {
						that.fcimg(res.tapIndex);
				    },
				    fail: function (res) {
				        console.log(res.errMsg);
				    }
				});
			},
			fcimg(t){
				var that=this;
				if(t==0){
					var lx=["camera"];
				}else{
					var lx=["album"];
				}
				uni.chooseImage({
				    count: 9,
					sizeType:"compressed",
					sourceType:lx,
				    success: function (res) {
				        const tempFilePaths = res.tempFilePaths;
						uni.showLoading({
						    title: '上传中'
						});
						for(var i=0;i<tempFilePaths.length;i++){
							uni.uploadFile({
								url: app.globalData.url+'upload/uploadImg',
								filePath: tempFilePaths[i],
								name: 'file',
								success: (uploadFileRes) => {
									uni.hideLoading();
									var str=JSON.parse(uploadFileRes.data)
									if(str.code!=1){
										uni.showToast({
											title: res.data.msg,
											icon:'none',
											duration: 1500
										});
										return false;
									}
									uni.showToast({
										title: str.msg,
										icon:'success',
										duration: 1000
									});
									var img=new Array();
									img[0]=str.data.image;
									that.teacher.images=that.teacher.images.concat(img);
								}
							});
						}
				    },
					fail(e){
						console.log(e);
					}
				});
			},
			addr(){
				var that=this;
				uni.chooseLocation({
				    success: function (res) {
						that.teacher.address=res.address;
						that.teacher.lng=res.longitude;
						that.teacher.lat=res.latitude;
				    },
					fail(e){
						console.log(e);
					}
				});
			},
			moren(e){
				this.sc=e.detail.value;
			},
			moren2(e){
				this.paytype=e.detail.value;
			},
			bindPickerChange: function(e) {
				this.teacher.sex = e.target.value
			},
			xli: function(e) {
				this.teacher.xuelis = e.target.value
				this.is_xl=1;
			},
			xue: function(e) {
				this.cy=e.detail.value;
			},
			catel: function(e) {
				if(e.detail.column==0){
					this.xueke[1]=this.cate[e.detail.value].cate;
					
					this.$forceUpdate();
				}
			},
			delimg(e){
				var index=e.currentTarget.dataset.index;
				this.teacher.images.splice(index,1);
			},
			nickname: function(event) {
			    this.teacher.nickname = event.target.value
			},
			jieshao: function(event) {
			    this.teacher.intro = event.target.value
			},
			gzyear: function(event) {
			    this.teacher.px_year = event.target.value
			},
			mobile: function(event) {
			    this.newmobile = event.target.value
			},
			yanzhengma: function(event) {
			    this.code = event.target.value
			}
		}
	}
</script>

<style>
	.jingyan4{width:30px;height:30px;line-height: 30px;text-align: center;margin-top: 7.5px;float: left;}
	.jingyan3{width:30px;height:30px;line-height: 30px;text-align: center;background-color: #f4f4f4;border-top-right-radius: 3px;border-bottom-right-radius: 3px;margin-top: 7.5px;float: left;font-size: 1.2rem;}
	.jingyan2 input{width:100%;height:30px!important;text-align: center;border:0px;}
	.jingyan2{width:50px;height:30px;line-height: 30px;text-align: center;background-color: #f4f4f4;margin-top: 7.5px;float: left;margin-left: 1px;margin-right: 1px;}
	.jingyan{width:30px;height:30px;line-height: 30px;text-align: center;background-color: #f4f4f4;border-top-left-radius: 3px;border-bottom-left-radius: 3px;margin-top: 7.5px;float: left;font-size: 1.2rem;}
	
	.paytype3{width:100%;height:40px;flex:1;}
	.paytype2{width:80px;height:40px;line-height: 40px;margin-right: 5px;}
	.paytype{width:94%;padding: 0px 3%;display: flex;border-bottom: 1px rgb(245, 245, 245) solid;}
	
	.geng8{width:80%;height:35px;line-height: 35px;background-color: #05c160;margin: 0 auto;color: #fff;text-align: center;border-radius: 3px;margin-top: 20px;}
	.geng7{width:30%;height:30px;line-height: 30px;text-align: center;background-color: #05c160;color:#fff;border-radius: 3px;margin-top: 5px;float: right;font-size: 0.75rem;margin-left: 5px;}
	.geng6 input{width:60%;height:40px;float: left;font-size: 0.875rem;}
	.geng6{width:100%;height:40px;flex:1;}
	.geng5{width:80px;height:40px;line-height: 40px;}
	.geng4{width:94%;padding: 0px 3%;height:40px;border-bottom: 1px rgb(245, 245, 245) solid;display: flex;}
	.geng3 image{width:20px;height:20px;float: right;margin-top: 10px;}
	.geng3 text{font-weight: 550;}
	.geng3{width:94%;padding: 0px 3%;height:40px;line-height: 40px;border-bottom: 1px rgb(245, 245, 245) solid;}
	.geng2{width:100%;height:200px;position: fixed;bottom: 0px;background-color: #fff;z-index: 9999;}
	.geng{width:100%;height:100vh;position: fixed;top:0px;z-index: 9995;background-color: #000000;opacity: 0.7;}
	.shenhe{width:94%;padding: 10px 3%;line-height: 25px;color:#0562cb;border-bottom: 1px rgb(245, 245, 245) solid;}
	.cause{width:94%;padding: 10px 3%;line-height: 25px;color:red;border-bottom: 1px rgb(245, 245, 245) solid;}
	.fengcai .fccha{width:20px;height:20px;position: absolute;top:-5px;right:-5px;background-color: #fff;border-radius: 50%;}
	.fengcai .fcimg{width:80px;height:80px;}
	.fengcai{width:80px;height:80px;margin-right: 15px;position: relative;margin-bottom: 10px;float: left;}
	.zhuzhu{color:#b2b1b1;}
	.info7 textarea{width:100%;height:88px;line-height: 22px;font-size: 0.85rem;margin-bottom: 8px;}
	.info7{width:100%;overflow: hidden;}
	.info6{width:100;height:45px;line-height: 45px;}
	.info5{width:94%;padding: 0px 3%;border-bottom: 1px rgb(245, 245, 245) solid;}
	.genghuan{width:60px;height:25px;line-height: 25px;text-align: center;background-color: #05c160;color:#fff;border-radius: 3px;margin-top: 10px;margin-left: 5px;font-size: 0.75rem;float: left;}
	.input-value-border{border:0px!important;}
	.info3 picker{height:45px;line-height: 45px;}
	.info4{width:100%;height:40px;line-height: 40px;text-align: center;background-color: #05c160;color:#fff;position: fixed;bottom: 0px;z-index: 999;}
	.info3 image{width:65px;height:65px;margin-top: 7.5px;}
	.info3 input{width:100%;height:45px;font-size: 0.85rem;color:#333;}
	.info3{width:100%;height:45px;flex:1;}
	
	.info2 text{color:red;}
	.info2{width:100px;height:45px;line-height: 45px;margin-right: 5px;}
	.info{width:94%;padding: 0px 3%;display: flex;border-bottom: 1px rgb(245, 245, 245) solid;}
	.main{width:100%;}
</style>
